
function initOptions(){
    //配置攻击溯源地图
    $.getJSON('./lib/china_geo.json', function (chinaJson) {
        echarts.registerMap('china', chinaJson);
        var chart = echarts.init(document.getElementById('attackSourceChart'));
        chart.setOption(getAttackSourceMapOption());
        mapInited=true;
    });

    //配置时间盘
    option=getAttackTimeGaugeOption();
    myChart = echarts.init(document.getElementById('timeChart'));
    myChart.setOption(option);

    //配置web流量仪表盘
    option=getWebStreamGaugeOption();
    myChart = echarts.init(document.getElementById('webStreamChart'));
    myChart.setOption(option);

    //配置攻击比例饼图
    option=getAttackTypePieOption();
    myChart = echarts.init(document.getElementById('attackTypeChart'));
    myChart.setOption(option);

    //配置异常事件柱状图
    option=getAbnormalTypeBarOption();
    myChart = echarts.init(document.getElementById('abnormalTypeChart'));
    myChart.setOption(option);
    
    //配置防火墙流量折线图
    option=getFirewallStreamLineOption();
    myChart = echarts.init(document.getElementById('firewallStreamChart'));
    myChart.setOption(option);
    //标记已初始化完成
    inited=true;
    
}

/**
 * 加载Web流量数据
 */
function loadWebStreamData(){
    if(!inited || !mapInited){
        setTimeout(loadWebStreamData,100);
        return;
    }
    //获取数据
    var data=REAL_MODE_DATA;
    var webStreamData=data.webStreamData.data[data.webStreamData.data.length-1];
    var max,min,chartMax,chartMin;
    var option,color;
    //处理数据
    max=Math.max(webStreamData.curStream,webStreamData.maxStream);
    min=Math.min(webStreamData.curStream,webStreamData.minStream);
    chartMin=min-Math.abs(webStreamData.curStream-webStreamData.minStream);
    chartMin= chartMin<=0? 0 : chartMin;
    chartMax=chartMin+Math.ceil((max+Math.abs(webStreamData.maxStream-webStreamData.curStream)-chartMin)/10)*10;
    
    if(webStreamData.curStream>webStreamData.maxStream || webStreamData.curStream<webStreamData.minStream)
        color='#dd545d';
    else
        color='#fff';
    //应用数据
    var chart = echarts.getInstanceByDom(document.getElementById('webStreamChart'));
    /*option={
        series:[{
            min:chartMin,
            max:chartMax,
            axisLine: { // 坐标轴线
                lineStyle: { // 属性lineStyle控制线条样式
                    color: [
                        [((min-chartMin)/(chartMax-chartMin)).toFixed(1),'#006699'],
                        [((max-chartMin)/(chartMax-chartMin)).toFixed(1), '#4cabce'],
                        [1, '#dd545d']
                    ],
                }
            },
            data:[{
                name:'当前流速',
                value:webStreamData.curStream
            }]
        }]
    };*/
    option={
        series:[{
            min:chartMin,
            max:chartMax,
            axisLine: { // 坐标轴线
                lineStyle: { // 属性lineStyle控制线条样式
                    color: [
                        [((webStreamData.curStream-chartMin)/(chartMax-chartMin)).toFixed(2),color],
                        [1, '#34364d']
                    ],
                }
            },
            data:[{
                name:'当前流速',
                value:webStreamData.curStream
            }]
        }]
    }
    
    chart.setOption(option); 

    
    $("#webStreamSubTitle").text(`实时流速 ${webStreamData.curStream}MB/min`);
}

/**
 * 加载防火墙流量数据
 */
function loadFirewallStreamData(){
    if(!inited || !mapInited){
        setTimeout(loadFirewallStreamData,100);
        return;
    }
    //获取数据
    var data=REAL_MODE_DATA;
    //处理数据
    var streamData=parseStreamLineData(data.firewallStreamData.data,false,20);
    console.log(streamData);
    //应用数据
    var chart = echarts.getInstanceByDom(document.getElementById('firewallStreamChart'));
    var option={
        series: [{
            data: streamData.arrCurStream,
            markArea:{
                data:streamData.abnormalArea
            }
        },{
            data: streamData.arrMaxStream
        },{
            data: streamData.arrMinStream
        }]
    };
    chart.setOption(option);

    $("#firewallStreamSubTitle").text(`实时访问速率 ${streamData.arrCurStream[14][1]}次/min`);
    
}

/**
 * 加载异常行为数据
 */
function loadAbnormalData(){
    if(!inited || !mapInited){
        setTimeout(loadAbnormalData,100);
        return;
    }
    //选择数据源
    var data=REAL_MODE_DATA;
    let eventsData=data.abnormalData.data;
    //处理数据
    var chartResultData=[0,0,0,0],
        tableData=[],
        dsc,
        index=0;
    //解析数据
    eventsData.forEach((event,index) => {
        switch (event.eventType) {
            case "ipAbnormal":
                chartResultData[0]+=1;
                dsc="IP访问异常";
                break;
            case "portAbnormal":
                chartResultData[1]+=1;
                dsc="端口访问异常";                    
                break;
            case "streamAbnormal":
                chartResultData[2]+=1;
                dsc="访问流量异常";                    
                break;
            case "visitorAbnormal":
                chartResultData[3]+=1;
                dsc="访客访问异常";                    
                break;
            default:
                break;
        };
        if(index<5)
            tableData.push([index+1,event.startTime,dsc]);
    });
    //应用数据
    //更新异常事件饼图
    var chart = echarts.getInstanceByDom(document.getElementById('abnormalTypeChart'));
    var option={
        series:[{
            data: chartResultData
        }]
    };
    chart.setOption(option);

    $("#abnormalTypeSubTitle").text(`异常行为总量 ${eventsData.length}次`);

    //更新表格
    $("#abnormalEventsTable").DataTable({
        data:tableData,
        columns: [
            { title: "序号" },
            { title: "发生时间" },
            { title: "异常类型" }
        ],
        paging:false,
        searching:false,
        info:false,
        ordering:false,
        destroy:true
    });
}

/**
 * 加载攻击事件数据
 */
function loadAttackData(){
    if(!inited || !mapInited){
        setTimeout(loadAttackData,100);
        return;
    }

    //选择数据源
    var data=REAL_MODE_DATA;
    let eventsData=data.attackData.data;
    //准备解析数据
    let attackPieData={};
    let attackMapData={};
    let chartResultData=[];
    let tableData=[];
    //解析数据
    eventsData.forEach((element,index) => {
        //更新比例图数据
        attackPieData[element.feature['type']] ? attackPieData[element.feature['type']]+=1 : attackPieData[element.feature['type']]=1;
        //更新地图数据
        attackMapData[element.feature['srcCity']] ? attackMapData[element.feature['srcCity']]+=1 : attackMapData[element.feature['srcCity']]=1;
        //更新表格数据
        if(index<5)
            tableData.push([index+1,element.startTime,element.feature['type']]);
    });

    //更新比例图
    for (const event in attackPieData) {
        chartResultData.push({name:event,value:attackPieData[event]});
    }
    var chart = echarts.getInstanceByDom(document.getElementById('attackTypeChart'));
    var option={
        series:[{
            data:chartResultData
        }]
    };
    chart.setOption(option);

    $("#attackTypeSubTitle").text(`攻击事件总量 ${eventsData.length}次`);
    //更新溯源地图
    chartResultData=[];
    var coord;
    for (const event in attackMapData) {
        coord=parseCityToCoord(event);
        if(event!="不详" && event!="域外")
            chartResultData.push([coord[0],coord[1],attackMapData[event],event]);
    }
    var chart = echarts.getInstanceByDom(document.getElementById('attackSourceChart'));
    option={
        series:{
            data:chartResultData
        }
    }
    chart.setOption(option);
    //更新事件表格
    $("#attackEventsTable").DataTable({
        data:tableData,
        columns: [
            { title: "序号" },
            { title: "发生时间" },
            { title: "攻击类型" }
        ],
        paging:false,
        searching:false,
        info:false,
        ordering:false,
        destroy:true
    });

}

function enter(){
    clearInterval(timer);
    $.get("./modules/login/login.html",function(data){
        $("#app").html(data);
    });
}